<template>
  <div>
    <pdf ref="pdf" v-for="i in numPages" :key="i" :src="url" :page="i"></pdf>
  </div>
</template>


// 平铺加载
<script>
import pdf from "vue-pdf";
export default {
  components: {
    pdf,
  },
  data() {
    return {
      url: "/pdf.pdf",
      numPages: null, // pdf 总页数
    };
  },
  mounted() {
    this.getNumPages();
  },
  methods: {
    getNumPages() {
      let loadingTask = pdf.createLoadingTask(this.url);
      loadingTask.promise
        .then((pdf) => {
          this.numPages = pdf.numPages;
        })
        .catch((err) => {
          console.error("pdf 加载失败", err);
        });
    },
  },
};
</script>